import 'package:bruno/bruno.dart';
import 'package:flutter/material.dart';
import 'package:flutter_app/bean/task_detail_entity.dart';
import 'package:flutter_app/utils/toast_utils.dart';
import 'package:flutter_app/values/MyColors.dart';
import 'package:flutter_app/widget/custom_app_bar.dart';
import 'package:flutter_screenutil/src/size_extension.dart';
import 'package:get/get.dart';

import '../../../r.dart';
import './horizontal_image/horizontal_image_view.dart';
import 'collect_detail_logic.dart';

/**
 * @Description: 任务详情
 * @Author: 下雨了
 * @CreateDate: 2022-6-2 16:55:48
 * @UpdateDate:  2022-7-7 09:02:39
 * @UpdateRemark: 根据原型V2.7进行修改
 * @Version: 1.1
 */
///
class CollectDetailPage extends StatefulWidget {
  final String title;

  CollectDetailPage({
    Key? key,
    required this.title,
  }) : super(key: key);

  @override
  _CollectDetailPageState createState() => _CollectDetailPageState();
}

class _CollectDetailPageState extends State<CollectDetailPage> {
  final logic = Get.put(CollectDetailLogic());
  final state = Get.find<CollectDetailLogic>().state;

  @override
  Widget build(BuildContext context) {
    return GetBuilder<CollectDetailLogic>(builder: (logic) {
      return Scaffold(
        appBar: MyAppBar(context, title: "任务详情"),
        body: SingleChildScrollView(
          child: Column(
            children: [
              Container(
                padding: EdgeInsets.fromLTRB(16.r, 17.r, 16.r, 18.r),
                decoration: BoxDecoration(
                    color: Colors.white
                ),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    RichText(
                      text: TextSpan(
                        children: [
                          // groupTaskDetailEntity.taskStatus  0进行中 1已完成
                          WidgetSpan(
                            child: Container(
                              margin: EdgeInsets.only(bottom: 1.r),
                              child: Image.asset(state.taskStatus, height: 16.r),
                            ),
                          ),
                          WidgetSpan(child: SizedBox(width: 8.r,)),
                          TextSpan(text: state.taskTitle, style: TextStyle(color: MyColors.FF333333, fontSize: 16.sp, fontWeight: FontWeight.w600)),
                        ]
                      )
                    ),
                    Container(
                      margin: EdgeInsets.only(top: 7.5.r),
                      child: Row(
                        crossAxisAlignment: CrossAxisAlignment.end,
                        children: [
                          Image.asset(R.assetsImgIcon23, height: 13.r,),
                          SizedBox(width: 5.5.r,),
                          Text(state.startTime, style: TextStyle(color: MyColors.FF666666, fontSize: 12.sp,),),
                        ],
                      ),
                    ),
                    Divider(
                      height: 24.r,
                      thickness: 0.5,
                      color: MyColors.FFDDDDDD,
                    ),
                    Container(
                      margin: EdgeInsets.only(top: 0.5.r),
                      child: Row(
                        children: [
                          Text("任务路线", style: TextStyle(color: MyColors.FF666666, fontSize: 13.sp,),),
                          SizedBox(width: 18.r),
                          Expanded(child: Text(state.areaName, style: TextStyle(color: MyColors.FF333333, fontSize: 13.sp,),)),
                        ],
                      ),
                    ),
                    Container(
                      margin: EdgeInsets.only(top: 8.r),
                      child: Row(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text("暗访单位", style: TextStyle(color: MyColors.FF666666, fontSize: 13.sp,),),
                          SizedBox(width: 18.r),
                          Expanded(child: Text(state.organListName, style: TextStyle(color: MyColors.FF333333, fontSize: 13.sp,),)),
                        ],
                      ),
                    ),
                    Container(
                      margin: EdgeInsets.only(top: 8.r),
                      child: Row(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text("小组成员", style: TextStyle(color: MyColors.FF666666, fontSize: 13.sp,),),
                          SizedBox(width: 18.r),
                          Expanded(
                            child: RichText(text: TextSpan(
                                children: [
                                  TextSpan(text: state.leaderName + " ", style: TextStyle(color: MyColors.FF333333, fontSize: 13.sp)),
                                  WidgetSpan(child: Image.asset(R.assetsImgIcon38, height: 16.r,)),
                                  TextSpan(text: state.groupName, style: TextStyle(color: MyColors.FF333333, fontSize: 13.sp,),)
                                ]
                            )),
                          )
                        ],
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                margin: EdgeInsets.only(top: 10.r),
                padding: EdgeInsets.fromLTRB(16.r, 15.r, 16.r, 15.r),
                decoration: BoxDecoration(
                    color: Colors.white
                ),
                child: Row(
                  children: [
                    Text("完成情况", style: TextStyle(color: MyColors.FF666666, fontSize: 13.sp,),),
                    Container(margin: EdgeInsets.only(left: 18.r)),
                    Expanded(child: GestureDetector(
                      child: Row(
                        children: [
                          Expanded(
                            child: Row(
                              children: [
                                Text("尚未完成", style: TextStyle(color: MyColors.FF333333, fontSize: 13.sp,),),
                                Text("（已完成${state.finishedNum.toString()}人）", style: TextStyle(color: MyColors.FF666666, fontSize: 13.sp,),),
                              ],
                            ),
                          ),
                          Stack(children: [
                            Container(
                              margin: EdgeInsets.only(right: 0),
                              child: ClipOval(child: Image.asset(R.assetsImgIcon0, height: 27.r,),),
                            ),
                            Visibility(
                              visible: state.groupNum >= 2,
                              child: Container(
                                margin: EdgeInsets.only(right: 15.5.r),
                                child:  ClipOval(child:Image.asset(R.assetsImgIcon0, height: 27.r,),),
                              ),
                            ),
                            Visibility(
                              visible: state.groupNum >= 3,
                              child: Container(
                                margin: EdgeInsets.only(right: 30.5.r),
                                child:  ClipOval(child:Image.asset(R.assetsImgIcon0, height: 27.r,),),
                              ),
                            ),
                          ],alignment: Alignment.centerRight,),
                          Container(margin: EdgeInsets.only(right: 7.r),),
                          Image.asset(R.assetsImgIcon48, height: 19.r,),
                        ],
                      ),
                      onTap: () {
                        showDialog(context: this.context, barrierColor: Color(0x50000000), builder: (_context) {
                          return Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Container(
                                height: 185.r,
                                margin: EdgeInsets.all(16.r),
                                padding: EdgeInsets.fromLTRB(20.r, 16.r, 20.r, 16.r),
                                decoration: BoxDecoration(
                                    color: Colors.white,
                                    borderRadius: BorderRadius.all(Radius.circular(10.r))
                                ),
                                child: ListView.builder(
                                  itemCount: state.taskDetailEntity?.collectGroupVO?.groupMemberVOList?.length,
                                  physics: BouncingScrollPhysics(),
                                  itemBuilder: (BuildContext context, int index) {
                                    return CollectStatusItem(state.taskDetailEntity!.collectGroupVO!.groupMemberVOList![index]);
                                  },
                                ),
                              ),
                              GestureDetector(
                                child: Image.asset(R.assetsImgIcon4, height: 37.r,),
                                onTap: (){
                                  Navigator.pop(_context);
                                },
                              ),
                            ],
                          ) ;
                        });
                      },
                    ))
                  ],
                ),
              ),
              Visibility(
                visible: state.taskDetailEntity?.memberStatus == "0",
                child: Container(
                  margin: EdgeInsets.only(top: 10.r),
                  padding: EdgeInsets.only(top: 18.r, right: 16.r, left: 16.r, bottom: 16.r),
                  width: Get.width,
                  decoration: BoxDecoration(
                      color: Colors.white
                  ),
                  child: Column(
                    children: [
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Row(
                            children: [
                              Container(margin: EdgeInsets.only(top: 2.r, right: 4.5.r), child: Image.asset(R.assetsImgIcon74, height: 15.r,)),
                              Text("可视化采集资料", style: TextStyle(color: MyColors.FF333333, fontSize: 16.sp, fontWeight: FontWeight.w500),),
                            ],
                          ),
                          SizedBox(
                            height: 30.r,
                            child: TextButton(
                              onPressed: () {
                                logic.goToPhotoGalleryPage();
                              },
                              child: Row(
                                children: [
                                  Text("查看全部", style: TextStyle(color: MyColors.FF999999, fontSize: 12.sp),),
                                  SizedBox(width: 6.5.r,),
                                  Image.asset(R.assetsImgIcon48, width: 10.r,),
                                ],
                              ),
                              style: TextButton.styleFrom(
                                  padding: EdgeInsets.all(0)
                              ),
                            ),
                          )
                        ],
                      ),
                      SizedBox(height: 14.5.r,),
                      // 用小组id 来确定文件名的唯一性
                      HorizontalImagePage(key: horizontalImageKey, dirName: logic.groupId, resultList: state.list,),
                    ],
                  ),
                ),
              ),
              Container(
                margin: EdgeInsets.only(top: 10.r),
                padding: EdgeInsets.fromLTRB(16.r, 15.r, 16.r, 0),
                decoration: BoxDecoration(
                    color: Colors.white
                ),
                child: Column(
                  children: [
                    Row(
                      children: [
                        Container(margin: EdgeInsets.only(top: 2.r, right: 7.5.r), child: Image.asset(R.assetsImgIcon73, height: 15.r,)),
                        Text("单位列表", style: TextStyle(color: MyColors.FF333333, fontSize: 16, fontWeight: FontWeight.w600),),
                      ],
                    ),
                    Container(
                      margin: EdgeInsets.only(top: 16.r, bottom: 8.r),
                      child: (state.taskDetailEntity?.orgProblemList?.length ?? 0) > 0 ?
                      ListView.separated(
                        padding: EdgeInsets.only(top: 0),
                        itemCount: state.taskDetailEntity!.orgProblemList!.length,
                        shrinkWrap: true, //解决无线高度问题 解决SingleChildScrollView 和listview冲突问题 ListView.builder
                        physics: NeverScrollableScrollPhysics(),
                        itemBuilder: (BuildContext context, int index) {
                          return CollectDetailItem(state.taskDetailEntity!.orgProblemList![index], index);
                        },
                        separatorBuilder: (BuildContext context, int index) {
                          return Divider(color: Colors.transparent, height: 8.r,);
                        },
                      ) :
                      Column(
                        children: [
                          Image.asset(R.assetsImgBg4, width: Get.width / 2.5,),
                          Container(margin: EdgeInsets.only(top: 10.r, bottom: 50.r), child: Text("暂无问题反馈", style: TextStyle(color: MyColors.FF333333, fontSize: 13.sp),))
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
        bottomNavigationBar: Visibility(
          visible: logic.getButtonShow(),
          child: Container(
            decoration: BoxDecoration(
                boxShadow: [BoxShadow(
                  color: Color(0x1a000000),
                  blurRadius: 6.67.r,
                  spreadRadius: 0.05.r,
                )],
                shape: BoxShape.rectangle,
                color: Colors.white
            ),
            padding: EdgeInsets.fromLTRB(16.r, 5.r, 16.r, 5.r),
            child: SafeArea(
              child: SizedBox(
                height: 40.r,
                child: TextButton(
                  style: TextButton.styleFrom(
                    backgroundColor: logic.getButtonClickState() ? MyColors.FF2763B9 : MyColors.FFEEEEEE,
                    padding: EdgeInsets.all(0),
                  ),
                  child: Text(logic.getButtonText(), style: TextStyle(color: MyColors.FFFFFFFF, fontSize: 14.sp, fontWeight: FontWeight.w600),),
                  onPressed: logic.getButtonClickState() ? () {
                    logic.confirmTask();
                  } : null,
                ),
              ),
            ),
          ),
        ),
      );
    });
  }

  /// 完成情况 list item
  Widget CollectStatusItem(TaskDetailCollectGroupVOGroupMemberVOList item){
    return Material(
      color: Colors.transparent,
      child: Container(
        margin: EdgeInsets.only(top: 6.r, bottom: 6.r),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            // todo 后续需要添加真正的头像路径
            Image.asset(R.assetsImgIcon0, height: 27.r,),
            Container(width: 50.r, margin: EdgeInsets.only(left: 5.r), child: Text(item.userName ?? "", style: TextStyle(color: MyColors.FF2763B9, fontSize: 14.sp, fontWeight: FontWeight.w600),)),
            Container(margin: EdgeInsets.only(left: 15.r), child: Image.asset(item.status == "2" ? R.assetsImgIcon20 : R.assetsImgIcon10, height: 14.5.r,)),
            Container(margin: EdgeInsets.only(left: 5.5.r), child: Text(logic.getMemberState(item.status ?? "0"), style: TextStyle(color: MyColors.FF666666, fontSize: 12.sp, fontWeight: FontWeight.w500),)),
            Expanded(child: Align(alignment: Alignment.centerRight, child: Text(item.updateTime ?? "", style: TextStyle(color: MyColors.FF999999, fontSize: 12.sp, fontWeight: FontWeight.w500), maxLines: 1,),))
          ],
        ),
      ),
    );
  }

  /// 问题填报 list item
  Widget CollectDetailItem(TaskDetailOrgProblemList item, int index) {
    return Container(
      height: 65.r,
      padding: EdgeInsets.only(left: 9.5, right: 9.5.r),
      decoration: BoxDecoration(
          color: MyColors.FFF5F5F5,
          borderRadius: BorderRadius.all(Radius.circular(5.r))
      ),
      child: InkWell(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Flexible(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(item.orgName ?? "", style: TextStyle(color: MyColors.FF333333, fontSize: 13.sp, fontWeight: FontWeight.w600),),
                  Visibility(
                    visible: (item.userIdList?.length ?? 0) > 0,
                    child: Container(
                      margin: EdgeInsets.only(top: 2.r),
                      child: Text(
                        "填报人：${logic.listToString(item.userIdList)}",
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                        style: TextStyle(color: MyColors.FF666666, fontSize: 12.sp),
                      ),
                    ),
                  )
                ],
              ),
            ),
            Row(
              children: [
                Row(
                  children: [
                    Text("${item.problemCount ?? 0}", style: TextStyle(color: MyColors.FFBC2A2A, fontSize: 12.sp),),
                    Text("项违规", style: TextStyle(color: MyColors.FF888888, fontSize: 12.sp),)
                  ],
                ),
                SizedBox(width: 11.5.r,),
                Image.asset(R.assetsImgIcon48, width: 10.r,),
              ],
            )
          ],
        ),
        onTap: () {
          // groupTaskDetailEntity.taskStatus  0进行中 1已完成   writeAuth	是否可以填报0否1是
          // if (groupTaskDetailEntity!.taskStatus == "0" && groupTaskDetailEntity!.writeAuth == "1") {
          if (state.taskDetailEntity!.taskStatus == "0") {
            if (logic.getOrganListLength(index)) {
              showBottomDialog(index);
            } else {
              logic.goToCollectTaskPage(index);
            }
          } else {
            toast.show("任务已完成");
          }
        },
      ),
    );
  }

  // 底部弹窗
  void showBottomDialog(int index) {
    // 初始化 单选索引
    int organIndex = 0;
    // 初始化 选择列表数据
    List<TaskDetailOrgProblemListOrganList>? organList = logic.getOrganList(index);
    showModalBottomSheet(
      context: context,
      shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.only(topLeft: Radius.circular(13.33.r), topRight: Radius.circular(13.33.r))
      ),
      // isScrollControlled属性，设置为true，弹窗会覆盖整个手机。设置为false，弹窗大概是整个屏幕的9/16高。
      isScrollControlled: true,
      builder: (_) {
        return StatefulBuilder(builder: (context, state) {
          return ConstrainedBox(
            constraints: BoxConstraints(maxHeight: MediaQuery.of(context).size.height * 6.0 / 10.0),
            child: Column(
              children: [
                Container(
                  margin: EdgeInsets.only(top: 14.r, bottom: 14.r, left: 16.r, right: 16.r),
                  child: Center(child: Text("选择窗口单位", style: TextStyle(color: MyColors.FF333333, fontSize: 18.sp),)),
                ),
                Divider(thickness: 0.5.r, height: 0, color: MyColors.FFDDDDDD,),
                Expanded(
                  child: Container(
                    padding: EdgeInsets.fromLTRB(16.r, 16.r, 16.r, 16.r),
                    child: ListView.separated(
                      padding: EdgeInsets.only(top: 0),
                      physics: BouncingScrollPhysics(),
                      itemCount: organList?.length ?? 0,
                      itemBuilder: (BuildContext context, int index) {
                        return BrnRadioButton(
                          radioIndex: index,
                          isSelected: organIndex == index,
                          mainAxisSize: MainAxisSize.min,
                          iconPadding:EdgeInsets.fromLTRB(0.r, 8.r, 16.r, 8.r),
                          child: Expanded(
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              crossAxisAlignment: CrossAxisAlignment.end,
                              children: [
                                Flexible(
                                  child: Text(organList?[index].orgName ?? "", maxLines: 1, style: TextStyle(color: MyColors.FF666666, fontSize: 14.sp,),)
                                ),
                                Visibility(
                                  visible: (organList?[index].problemCount ?? 0) > 0,
                                  child: Text((organList?[index].problemCount ?? 0).toString(), style: TextStyle(color: MyColors.FF333333, fontSize: 12.sp),),
                                ),
                              ],
                            ),
                          ),
                          onValueChangedAtIndex: (index, value) {
                            state(() {
                              organIndex = index;
                            });
                          },
                        );
                      },
                      separatorBuilder: (BuildContext context, int index) {
                        return Divider(color: Colors.transparent, height: 8.r,);
                      },
                    ),
                  ),
                ),
                Container(
                  child: Container(
                    width: Get.width,
                    color: Colors.white,
                    padding: EdgeInsets.only(top: 5.r, bottom: 5.r, left: 16.r, right: 16.r),
                    child: SafeArea(
                      child: SizedBox(
                        height: 40.r,
                        child: TextButton(
                          style: TextButton.styleFrom(
                            backgroundColor: MyColors.FF2763B9,
                            padding: EdgeInsets.all(0),
                          ),
                          child: Text("确定", style: TextStyle(color: MyColors.FFFFFFFF, fontSize: 14.sp),),
                          onPressed: () {
                            Navigator.pop(context);
                            logic.goToCollectTaskPage(index, organIndex: organIndex);
                          },
                        ),
                      ),
                    ),
                  ),
                )
              ],
            ),
          );
        });
      },
    );
  }

  @override
  void dispose() {
    Get.delete<CollectDetailLogic>();
    super.dispose();
  }
}
